import { BasicColumn } from '/@/components/Table';
import { FormSchema } from '/@/components/Table';
import { verifyUsername } from '/@/api/system/system';
import { UserReq } from '/@/api/system/modal/userModel';
import { h } from 'vue';
import { Avatar } from 'ant-design-vue';

export const columns: BasicColumn[] = [
  {
    title: '用户账户',
    dataIndex: 'username',
    width: 120,
  },
  {
    title: '头像',
    dataIndex: 'iconFileUrl',
    width: 60,
    customRender: ({ record }) => {
      return h(Avatar, { src: record.iconFileUrl });
    },
  },
  {
    title: '姓名',
    dataIndex: 'realName',
    width: 120,
  },
  {
    title: '邮箱',
    dataIndex: 'email',
    width: 200,
  },
  {
    title: '创建时间',
    dataIndex: 'createdDate',
    width: 180,
  },
  {
    title: '备注',
    dataIndex: 'note',
  },
];

export const searchFormSchema: FormSchema[] = [
  {
    field: 'param.usernameByLike',
    label: '用户名',
    component: 'Input',
    colProps: { span: 8 },
  },
  {
    field: 'param.realNameByLike',
    label: '姓名',
    component: 'Input',
    colProps: { span: 8 },
  },
];

export const accountFormSchema: FormSchema[] = [
  {
    field: 'iconFileList',
    label: '头像',
    slot: 'icon',
    component: 'Upload',
  },
  {
    field: 'username',
    label: '用户名',
    component: 'Input',
    helpMessage: ['用户名验证', '不能输入带有admin和特殊字符的用户名'],
    rules: [
      {
        required: true,
        message: '请输入用户名',
      },
      {
        validator(_, value) {
          return new Promise((resolve, reject) => {
            if (value) {
              const userReq: UserReq = {
                username: value,
              };
              verifyUsername(userReq)
                .then((res) => {
                  console.log('res', res);
                  resolve();
                })
                .catch((error) => {
                  const { response, message } = error || {};
                  const msg: string = response?.data?.message ?? message;
                  reject(msg || '验证失败');
                });
            }
          });
        },
      },
    ],
  },
  {
    field: 'password',
    label: '密码',
    component: 'InputPassword',
    required: true,
    ifShow: true,
  },
  {
    field: 'realName',
    label: '姓名',
    component: 'Input',
    required: true,
  },
  {
    label: '角色',
    field: 'roleIds',
    slot: 'roleIds',
    component: 'ApiSelect',
    required: true,
  },
  {
    field: 'deptIds',
    label: '所属部门',
    slot: 'deptIds',
    component: 'TreeSelect',
    required: true,
  },
  {
    field: 'homeMenuId',
    label: '首页菜单',
    slot: 'menuIds',
    component: 'TreeSelect',
    required: true,
  },
  {
    label: '邮箱',
    field: 'email',
    component: 'Input',
    required: true,
  },
  {
    label: '备注',
    field: 'note',
    component: 'InputTextArea',
    componentProps: {
      rows: 4,
      maxlength: 100,
      showCount: true,
    },
  },
];
